<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>我的购物车 - ${web.name}${web.additionalTitle!}</title>
    <link href="${root}/css/global.css" type="text/css" rel="stylesheet"/>
    <link href="${root}/css/layout.css" type="text/css" rel="stylesheet"/>
    <link href="${root}/css/checkout.css" type="text/css" rel="stylesheet"/>
    <link href="${root}/css/member.css" type="text/css" rel="stylesheet"/>
    <link href="${root}/css/buy.css" type="text/css" rel="stylesheet"/>
    <link href="${root}/css/cart.css" type="text/css" rel="stylesheet"/>
    <script src="${root}/js/jquery.js" type="text/javascript"></script>
    <script src="${root}/js/cart_sure.js" type="text/javascript"></script>
    <script type="text/javascript">
        var URLPrefix = {
            "url": "${base}"
        };
        $(function () {
            $("#baseForm").validate();
            $(':checkbox[name=memberCoupon]').each(function () {
                $(this).click(function () {
                    if ($(this).attr('checked')) {
                        $(':checkbox[name=memberCoupon]').removeAttr('checked');
                        $(this).attr('checked', 'checked');
                    }
                    if ($("#memberCoupon").attr("checked") == true) {
                        var memberCoupon = document.getElementsByName("memberCoupon");
                        for (var i = 0; i < memberCoupon.length; i++) {
                            if (memberCoupon[i].checked) {
                                var str = memberCoupon[i].value;
                                var strs = new Array();
                                strs = str.split(",");
                                $("#deduceAmount").html(strs[1]);
                                $("#memberCouponId").val(strs[0]);
                            }
                        }
                    } else {
                        $("#deduceAmount").html(0);
                        $("#memberCouponId").val("");
                    }
                    var cart_price = $("#cart_price").html();
                    var deduceAmount = $("#deduceAmount").html();
                    var totalDeliveryFee = $("#totalDeliveryFee").html();
                    $("#amount_payable").html(parseFloat(cart_price) + parseFloat(totalDeliveryFee) - parseFloat(deduceAmount));
                });
            });

        });
        $().ready(function () {
            var $paymentMethodId = $("#paymentMethod :radio");
            var $shippingMethodId = $("#shippingMethod :radio");
            var shippingMethodIds = {};
            [#list
            paylist
            as
            pay
            ]
            shippingMethodIds["${pay_index+1}"] = [
                [#list
            pay.shippings
            as
            sp
            ]
            "${sp.id}"[#if sp_has_next]
            ,
            [/#if][/#list
            ]]
            ;
            [/#list
            ]
            // 支付方式
            $paymentMethodId.click(function () {
                var $this = $(this);
                if ($(this).attr("disabled")) {
                    return false;
                }
                var paymentMethodId = $this.val();
                $shippingMethodId.each(function () {
                    var $this = $(this);
                    if ($.inArray($this.val(), shippingMethodIds[paymentMethodId]) >= 0) {
                        $(this).attr("disabled", false);
                    } else {
                        $this.attr("disabled", true).attr("checked", false);
                    }
                });

            });
            // 配送方式
            $shippingMethodId.click(function () {
                var $this = $(this);
                if ($(this).attr("disabled")) {
                    return false;
                }
            });
        });

        //获得城市
        function getResultCity(d) {
            $.post('../shopMemberAddress/findAllCity.htm', {"id": d},
                    function (data) {
                        if (data.success) {
                            $("#itemcity").html("");
                            var select = "<select name='cityId' onchange='getResultCountry(this.value)'>";
                            for (var i = 0; i < data.ids.length; i++) {
                                select += "<option value='" + data.ids[i] + "'>&nbsp;" + data.citys[i] + "&nbsp;</option>";
                            }
                            select += "</select>";
                            getResultCountry(data.ids[0]);
                            $("#itemcity").append(select);
                        }
                    }, "json");
        }
        //获得县、区
        function getResultCountry(a) {
            $.post('../shopMemberAddress/findAllCountry.htm', {"id": a},
                    function (data) {
                        if (data.success) {
                            $("#itemarea").html("");
                            var select = "<select name='countryId'>";
                            for (var i = 0; i < data.ids.length; i++) {
                                select += "<option value='" + data.ids[i] + "'>&nbsp;" + data.areas[i] + "&nbsp;</option>";
                            }
                            select += "</select>";
                            $("#itemarea").append(select);
                        }
                    }, "json");
        }

        function checkSubmit() {
            if ($("#provinceId").val() == '' || $("#provinceId").val() == null) {
                alert("请选择所在地址!");
                return;
            }
            if ($("#tel").val() == null && $("#phone").val() == null && $("#tel").val() == '' && $("#phone").val() == '') {
                alert("手机跟电话至少有一项必填");
                return;
            }
            $("#baseForm").attr("action", "../shopMemberAddress/address_save.htm");
            $("#baseForm").submit();
        }

        function checkSubmit1() {
            if ($("input[name='deliveryInfo']").length <= 0) {
                alert("请添加邮寄地址");
                return;
            }
            if ($("input[name='paymentMethodId']").length <= 0) {
                alert("请选择支付方式");
                return;
            }
            var $checkedShippingMethodId = $("#shippingMethod :radio").filter(":checked");
            if ($checkedShippingMethodId.size() == 0) {
                alert("请选择配送方式");
                return;
            }
            var pd = false;
            $("input[name='deliveryInfo']").each(function () {
                if ($(this).attr("checked")) {
                    pd = true;
                }
            });
            if (!pd) {
                alert("请选择邮寄地址！");
                return;
            }
            $("#addrInputDiv").html('');
            $("#baseForm").attr("action", "../order/order_shipping.htm");
            $("#baseForm").submit();
        }
        function showBalanceDiv(a) {
            if (a.className == "") {
                a.className = "bh-on";
                $("#balance_div").fadeOut("800");
            } else {
                a.className = "";
                $("#balance_div").fadeIn("800");
            }
        }

        function showCouponDiv(a) {
            if (a.className == "") {
                a.className = "bh-on";
                $("#coupon_div").fadeOut("800");
            } else {
                a.className = "";
                $("#coupon_div").fadeIn("800");
            }
        }

        function showRemark(chk) {
            if (chk.checked) {
                $("#remark").fadeIn("500");
            } else {
                $("#remark").fadeOut("500");
            }
        }
    </script>
</head>
<body>
[#include "../include/header_top.html"/]
<div id="head">
    [#include "../include/header_search.html"/]
    [#include "../include/header_nav.html"/]
</div>
<div class="w960">
<div id="topcolumn"></div>
<div class="buy_position">您当前的位置：<a href="" target="_blank">首页</a>&nbsp;&gt;&nbsp;确认订单信息</div>
<ul class="step clearfix mt10">
    <li><span>STEP 1.</span>查看购物车</li>
    <li class="on"><span>STEP 2.</span>确认订单信息</li>
    <li><span>STEP 3.</span>成功提交订单</li>

</ul>
<div id="checkoutUI" class="mt10">
<div id="errorMsgDisplayDiv" style="z-index:1000;"></div>
<form id="baseForm" action="../order/order_shipping.htm" method="post">
<div id="receiver_buffer_window" class="delivery mb10">
    <div class="title"><h2>收货人信息</h2></div>

    <div id="inputUI_rece" class="rece_box">
        <p class="adds_btn" id="btn_away_ui">&nbsp;</p>
        [#if smalist?size gt 0]
        [#list smalist as sma]
        <p class="adds_list adds_selected">
            <label class="pointer">
                <input type="radio" name="deliveryInfo" class="delivery_info" value="${sma.id}"
                [#if sma.isDefault]checked="checked"[/#if]"/>
	                  <span class="text" style="position:relative">
	                   ${sma.username!}&nbsp;${sma.province.name!}&nbsp;${sma.city.name!}
	                    &nbsp;${sma.detailaddress!}&nbsp;${sma.tel!}&nbsp;&nbsp;&nbsp;&nbsp;
	                  <a href="../shopMemberAddress/address_delete.htm?id=${sma.id}&returnUrl=../cart/checkout_shipping.htm"
                         class="w44">删除|</a>
                      <a href="../shopMemberAddress/address_default.htm?id=${sma.id}&returnUrl=../cart/checkout_shipping.htm">设为默认</a>
	                 </span>
            </label>
        </p>
        [/#list]
        [/#if]
        <p class="add_adds">
            <span class="btn_span" onclick="jQuery('#addrInputDiv').show();">添加新地址</span>
            <span class="btn_span" onclick="jQuery('#addrInputDiv').hide();">取消新地址</span>
        </p>
        <hr class="delivery_hr"/>
        <div id="addrInputDiv" class="adress_edit2 none">
            <h3 class="h3">请填写收货人信息：</h3>

            <p class="info_form">
                <label for="user_name" class="lab"><em>*</em>收&nbsp;货 &nbsp;人：</label>
                <input type="text" id="receiverName" name="username" class="user_name text required"/>
                <span id="nameError" class="prompt"></span>
            </p>

            <p class="info_form">
                <label for="user_name" class="lab"><em>*</em>性&nbsp;&nbsp;&nbsp;&nbsp;别：</label>&nbsp;
                <input type="radio" name="gender" value="true" checked/>男&nbsp;&nbsp;&nbsp;&nbsp;
                <input type="radio" name="gender" value="false"/>女
            </p>

            <p class="info_form">
                <label for="select_province" class="lab"><em>*</em>收货地址：</label>
                <select id="provinceId" name="provinceId" onchange="getResultCity(this.value)">
                    <option value="">--请选择--</option>
                    [#list plist as province]
                    <option value="${province.id!}">${province.name!}</option>
                    [/#list]
                </select>
                <span id="itemcity"></span>
                <span id="itemarea"></span>
            </p>
            <p class="info_form">
                <label for="user_adress" class="lab"><em>*</em>详细地址：</label>
                <input id="detailAddress" name="detailaddress" class="user_adress text required"
                       type="text"/>
            </p>

            <p class="info_form">
                <label for="user_adress" class="lab"><em>*</em>邮政编码：</label>
                <input id="postCode" name="postCode" class="user_phone text required digits" type="text"/>
            </p>

            <p class="info_form">
                <label for="user_phone" class="lab">手机号码：</label>
                <input type="text" id="tel" name="tel" class="user_phone text digits"/>
                <span id="mobileError" class="prompt">手机或电话必填一种</span>
            </p>

            <p class="info_form">
                <label for="user_phone" class="lab"> 固定电话：</label>
                <input type="text" id="areaCode" name="areaCode" size="4" maxlength="4"
                       class="user_areaCode text digits"/>-
                <input type="text" id="phone" name="phone" size="14" maxlength="10"
                       class="user_phone text digits"/>-
                <input type="text" id="extNumber" name="extNumber" size="6" maxlength="6"
                       class="user_extNumber text digits"/>
                区号(3到4位数字，可选)-电话号码(7到8位数字)-分机号(最多6位数字，可选)
            </p>

            <p class="info_form">
                <input type="checkbox" onclick="$('#isDefault').val(this.checked)"/>
                <input type="hidden" id="isDefault" name="isDefault" value="false"/>
                <label for="daily_address">设为默认地址</label>
            </p>

            <p class="btn" id="addrSubBtn">
                <input type="hidden" name="returnUrl" value="../cart/checkout_shipping.htm"/>
                <input type="button" value="保存收货信息" onclick="checkSubmit();"/>
            </p>
        </div>
    </div>
</div>
<div id="payment_buffer_window" class="delivery mb10">
    <div class="title"><h2>支付方式</h2></div>
    <div class="delivery_box" id="paymentMethod">
        [#list paylist as pay]
        <p id="pNet" class="radio_select">
            <input type="radio" id="paymentMethod_${pay.id}" name="paymentMethodId" value="${pay.id}" [#if
            pay.disabled]disabled[/#if] [#if pay.isDefault]checked="true"[/#if]/>
            <label>${pay.name!}</label>
            <span class="des"> ${pay.introduce!}</span>
        </p>
        [/#list]
    </div>
</div>
<div id="delivery_buffer_window" class="delivery mb10">
    <div class="title"><h2>配送信息</h2></div>
    <div class="delivery_box" id="inputUI_delivery">

        <table>
            <tr class="head">
                <td width="70"></td>
                <td width="310">商品名称</td>
                <td width="65" align="center">数　量</td>
                <td width="80" align="center">重　量</td>
                <td width="120" align="center">金额小计</td>
                <td width="300" align="left">配送方式</td>
            </tr>
            [#list items as item]
            <tr class="body">
                <td width="70"><a class="img60" href="${item.product.url}" target="_blank">
                    <img src="${item.product.productExt.coverImg!}" width="60" height="60"/></a></td>
                <input type="hidden" name="cartItemId" value='${item.id!}'/>
                <td width="310">
                    <a href="${item.product.url}" title="${item.product.name!}" class="a2" target="_blank">
                        [@text_cut s=item.product.name len='10' appent='...'/]
                        [#if item.productFash??]${item.productFash.attitude!!}[/#if]</a>
                </td>
                <td width="65" align="center"><span id="cart_count_${item.id}">${item.count!0}</span></td>
                <td width="80" align="center"><span
                        id="cart_weight_${item.id}">${item.product.productExt.weight!0}</span>g
                </td>
                <td width="120" align="center">¥<span id="cart_price_${item.id}">[#if item.productFash??]${item.productFash.salePrice!}[#else]${item.product.salePrice!}[/#if]</span>
                </td>
                [#if item_index==0]
                <td width="300" rowspan="${items?size}" align="left">
                    <div id="shippingMethod" style="position:relative;zoom:1;float:left;width:100%;">
                        [#list splist as sp]
                        <div style="height: 43px;position: relative;z-index: 0;width: 100%;">
                            <input type="radio"
                                   onclick="ajaxtotalDeliveryFee('${sp.id}','${item.product.weight!0}');"
                                   id="shippingMethod_${sp_index+1}" name="shippingMethodId"
                                   class="delivery_radio" [#if sp.disabled]disabled[/#if] [#if
                            sp.isDefault]checked[/#if] value="${sp.id}" />
                            <label style="line-height: 43px;margin-right: 45px;">${sp.name!}</label>
                        </div>
                        [/#list]
                    </div>
                </td>
                [/#if]
            </tr>
            [/#list]
        </table>

    </div>
</div>


<div id="delivery_buffer_window" class="delivery mb10">
    <div class="title"><h2>结算信息</h2></div>
    <div class="delivery_box" id="inputUI_delivery">
        <ul>
            <li><span class="bold">商品金额：￥<strong><span id="cart_price"></span></strong>元</span>&nbsp;+
                运费：￥<strong id="totalDeliveryFee"></strong>元&nbsp;-&nbsp;优惠券：￥<strong><span
                        id="deduceAmount">0.0</span></strong>元-&nbsp;立省：￥<strong><span id="popularityPrice">${popularityPrice!}</span></strong>元
                &nbsp;&nbsp;&nbsp;<span class="bold">重量：<strong><span
                        id="cart_weight"></span></strong>g</span>
            </li>
            <li>
                <div style="border:none!important;font-size:14px;float:right">
                                <span class="bold">应付金额:<strong><span
                                        style="font-size:14px;color:#a71f24;font-weight:bold"
                                        id="amount_payable"></span></strong>元</span>
                </div>

                <div><a href="javascript:void(0);" onclick="showCouponDiv(this)"><span
                        style="font-size:14px;color:#a71f24;font-weight:bold">使用优惠券抵消部分总额</span></a> （<a
                        target="_blank" href="${base}/coupon.htm">领取优惠券</a>）
                </div>
                <div style="display: none;" id="coupon_div">
                    <input type="hidden" id="memberCouponId" name="memberCouponId"/>
                    [#list memberCouponlist as memberCoupon]
                    <p><input type="checkbox" name="memberCoupon" id="memberCoupon"
                              value="${memberCoupon.id},${memberCoupon.coupon.couponPrice!}"/>${memberCoupon.coupon.couponName}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;面值:${memberCoupon.coupon.couponPrice!}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;有效期：${memberCoupon.coupon.couponTime}--${memberCoupon.coupon.couponEndTime!}
                    </p>
                    [/#list]
                </div>
            </li>
        </ul>
        <div>
            <br>
            <input type="checkbox" id="remark_chk" onclick="showRemark(this)"/>订单备注
            <input type="text" name="comments" id="remark" style="display:none;"/>
        </div>
    </div>
</div>


<div class="delivery_box" id="inputUI_delivery">
    <p class="btn"><input type="button" id="confirm_delivery" value="提交订单" onclick="checkSubmit1();"/></p>
</div>
</form>
</div>
</div>
[#include "../include/footer.html"/]
</body>
</html>
